<ion-header>
  <ion-navbar>
    <ion-title>Photo Gallery</ion-title>
  </ion-navbar>
</ion-header>
<ion-content>
  <!-- Swiper -->
  <div id="gallery-top" class="swiper-container gallery-top">
    <div class="swiper-wrapper">
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/1)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/2)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/3)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/4)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/5)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/6)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/7)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/8)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/9)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/10)"></div>
    </div>
    <!-- Add Arrows -->
    <div class="swiper-button-next swiper-button-white"></div>
    <div class="swiper-button-prev swiper-button-white"></div>
  </div>
  <div id="gallery-thumbs" class="swiper-container gallery-thumbs">
    <div class="swiper-wrapper">
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/1)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/2)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/3)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/4)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/5)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/6)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/7)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/8)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/9)"></div>
      <div class="swiper-slide" style="background-image:url(https://lorempixel.com/1200/1200/nature/10)"></div>
    </div>
  </div>
</ion-content>

